header {
  height: 3.88rem;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
  background: #7c745f;
}

header .icon-shezhi {
  position: absolute;
  right: 0.2rem;
  top: 0.34rem;
  font-size: 0.44rem;
  color: #fffef6;
  vertical-align: middle;
}

header .img {
  width: 1.52rem;
  height: 1.52rem;
  border-right: 50%;
  overflow: hidden;
}

header .img img {
  width: 1.52rem;
  height: 1.52rem;
  border-radius: 50%;
}

header h5 {
  margin-top: 0.18rem;
  margin-bottom: 0.18rem;
  height: 0.54rem;
  line-height: 0.54rem;
  color: #fff;
}

header > p {
  color: #fff;
  height: 0.26rem;
  font-size: 0.26rem;
}

header > p span {
  display: inline-block;
  line-height: 0.24rem;
}

main {
  margin-bottom: 0.98rem;
}

main .mode {
  width: 7.5rem;
  height: 1.3rem;
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  background: #403c39;
}

main .mode .cont {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  color: #fffdfc;
}

main .mode .cont span:nth-child(1) {
  font-size: 0.48rem;
}

main .mode .cont span:nth-child(2) {
  font-size: 0.2rem;
  margin-top: 0.06rem;
}

main .about {
  padding: 0 0.31rem 0 0.38rem;
}

main .about li {
  height: 1.05rem;
  display: flex;
  justify-content: space-between;
  align-items: center;
  border-bottom: 1px solid #f1f1f1;
}

main .about li h5 {
  color: #1e1e1e;
  font-size: 0.31rem;
}

main .about li h5 .game {
  display: inline-block;
  width: 0.16rem;
  height: 0.16rem;
  border-radius: 50%;
  background-color: #fa5f5b;
  margin-left: 0.29rem;
  transform: translateY(-0.03rem);
}

main .about li span {
  color: #969696;
  font-size: 0.2rem;
  font-weight: 600;
  padding-top: 0.03rem;
}

footer {
  position: fixed;
  background-color: #fff;
  left: 0;
  right: 0;
  bottom: 0;
  height: 0.98rem;
  border-top: 1px solid #e4e4e4;
  display: flex;
  justify-content: space-around;
  align-items: center;
}

footer a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #262626;
}

footer a span:nth-child(1) {
  font-size: 0.44rem;
}

footer a span:nth-child(1).active {
  color: #0d7ae1;
}

footer a span:nth-child(2) {
  font-size: 0.2rem;
}

footer a span:nth-child(2).active {
  color: #0d7ae1;
}
